<template>
   <div>
    <div><img :src="imgUrl" width="360px"/></div>
    <div class="login">
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;用户名<input type="text" v-model="username" ></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;输密码<input type="password" v-model="password"></div>
<div>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<button @click="login">登录</button></div>
</div>
    </div>
  </template>
  
<script setup>
import { ref } from 'vue'

let imgUrl = ref('https://imgpinpai.phb123.com/d/file/2020-10-05/5c732ed8ec087760987a512d922d7fd0.png')
let username = ref('')
let password = ref('')

const login = ()=>{
    console.log(username.value,password.value,'实现登录');
}
</script>
<style scoped>
.login{
    text-align: center;
    position: fixed;
    bottom: 300px;
}

</style>